<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

    <head th:include="include :: header"></head>
    <link rel="stylesheet" th:href="@{/css/plugins/bootstrap-4.3.1-dist/css/bootstrap.min.css}">
    <style>
        li{ list-style: none;}
    </style>
	<body class="gray-bg">
    <!--<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">-->
    <!--<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>-->
    <!--<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>-->
    <!--<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>-->
            <div class="wrapper wrapper-content animated fadeInRight">
                <div class="container">

                    <!--<p><strong>注意:</strong> 使用 <strong>data-parent</strong> 属性来确保所有的折叠元素在指定的父元素下，这样就能实现在一个折叠选项显示时其他选项就隐藏。</p>-->
                    <div id="accordion">
                        <div class="card">
                            <div class="card-header">
                                <a class="card-link" data-toggle="collapse" href="#collapseOne">
                                    产品信息
                                </a>
                            </div>
                            <div id="collapseOne" class="collapse show" >
                                <div class="card-body">
                                    <div class="ibox-content">
                                        <form class="form-horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-2 control-label">
                                                    产品：
                                                </label>
                                                <div class="col-sm-10">
                                                     <input class="form-control" type="text" th:value="${result.product.productName}" readonly>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-sm-2 control-label">
                                                    产品规格：
                                                </label>
                                                <div class="col-sm-10">
                                                    <input class="form-control" type="text" th:value="${result.product.productSpec}" readonly>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-sm-2 control-label">
                                                    包装数量：
                                                </label>
                                                <div class="col-sm-10">
                                                    <input class="form-control" type="text" th:value="${result.product.boxSize}" readonly>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-sm-2 control-label">
                                                    零售价格：
                                                </label>
                                                <div class="col-sm-10">
                                                    <input class="form-control" type="text" th:value="${result.product.productPrice}" readonly>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-sm-2 control-label">
                                                    产品图片：
                                                </label>
                                                <div class="col-sm-10">
                                                    <!--<input class="form-control" type="text" th:value="${result.product.productSpec}" readonly>-->
                                                    <img th:src="${result.product.productImg}" class="img-responsive center-block">
                                                </div>
                                            </div>
                                            <div th:if="${result.product.productFieldVOS != null}">
                                                <div class="form-group" th:each="item,index : ${result.product.productFieldVOS}">
                                                    <label class="col-sm-2 control-label" th:text="${item.attrFieldName} + '：'">
                                                        产品规格：
                                                    </label>
                                                    <div class="col-sm-10">
                                                        <input class="form-control" type="text" th:value="${item.values}" readonly>
                                                    </div>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <a class="card-link" data-toggle="collapse" href="#collapseTwo">
                                    报告信息
                                </a>
                            </div>
                            <div id="collapseTwo" class="collapse show" >
                                <div class="card-body">
                                    <div class="ibox-content">
                                        <form class="form-horizontal">
                                            <div th:if="${result.report.reportImgDOList != null}">
                                                <div class="form-group" th:each="item,index : ${result.report.reportImgDOList}">
                                                    <!--<label class="col-sm-2 control-label" th:text="${item.attrFieldName}">-->
                                                        <!--产品规格：-->
                                                    <!--</label>-->
                                                    <div class="col-sm-10">
                                                        <!--<input class="form-control" type="text" th:value="${item.imgSrc}" readonly>-->
                                                        <img th:src="${item.imgSrc}" class="img-responsive center-block"/>
                                                    </div>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <a class="card-link" data-toggle="collapse" href="#collapseThree">
                                    批次信息
                                </a>
                            </div>
                            <div id="collapseThree" class="collapse show" >
                                <div class="card-body">
                                    <div class="ibox-content">
                                        <form class="form-horizontal">

                                            <div th:if="${result.traceOutFieldDOS != null}">
                                                <div class="form-group" th:each="item,index : ${result.traceOutFieldDOS}">
                                                    <label class="col-sm-2 control-label" th:text="${item.attrFieldName}+'：'">

                                                    </label>
                                                    <div class="col-sm-10">
                                                        <input class="form-control" type="text" th:value="${item.values}" readonly>
                                                    </div>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <a class="card-link" data-toggle="collapse" href="#collapseFour">
                                    溯源信息
                                </a>
                            </div>
                            <div id="collapseFour" class="collapse show" >
                                <div class="card-body">
                                    <div class="ibox-content">
                                        <form class="form-horizontal">

                                            <div th:if="${result.produceCenter != null}">
                                                <div th:each="item,index : ${result.produceCenter}">
                                                    <h3 th:text="${item.tyMenu.menuName}"></h3>

                                                    <div class="form-group" th:each="menuData,index : ${item.tyMenuDataList}">
                                                        <label class="col-sm-2 control-label" th:text="${menuData.dataKey} + '：'">

                                                        </label>
                                                        <div class="col-sm-10">
                                                            <!--<input class="form-control" type="text" th:value="${menuData.dataValue}"  readonly>-->
                                                            <input class="form-control" type="text"
                                                                   th:if="${menuData.type != 1}"
                                                                   th:value="${menuData.dataValue}"
                                                                   readonly>

                                                            <div th:unless="${menuData.type != 1}">
                                                                <a class='btn btn-success' title="查看图片"
                                                                   th:onclick="'imgView('+${menuData.menuDataId}+')'">查看图片</a>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <h5 class="page-header"></h5>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--<a class="btn btn-primary pull-right" style="margin-top: 10px"  href="#" onClick="javascript :history.go(-1);">返回</a>-->
                </div>
        </div>
    <script th:src="@{/js/plugins/jquery-3.2.1/jquery-3.2.1.min.js}"></script>
    <script th:src="@{/js/plugins/bootstrap-4.3.1-dist/js/bootstrap.min.js}"></script>
    <div th:include="include::footer"></div>

    <script type="text/javascript">
        function imgView(id) {
            console.log("id--------------"+id)
            layer.open({
                type: 2,
                title: '查看图片',
                maxmin: true,
                shadeClose: false, // 点击遮罩关闭层
//                area: ['800px', '520px'],
                content: ctx + 'wx/getTyMenuDataById/' + id // iframe的url
            });
        }
    </script>

	</body>

</html>